<template>
	<view class="box" v-if="type==1" style="margin-top: 0;border-radius: 0 0 30rpx 30rpx;">
		<view style="height: 110rpx;width: 100%;display: flex;align-items: center;justify-content: space-between;">
			<view
				style="height: 100%;display: flex;flex-direction: column;align-items: flex-start;justify-content: space-between;">
				<view style="font-size: 34rpx;line-height: 34rpx;">{{bankName}}</view>
				<view style="font-size: 40rpx;line-height: 40rpx;">{{accountNumber}}</view>
			</view>
			<navigator
				:url="`/pages/bank/bank?realName=${realName}&idNumber=${idNumber}&bankName=${bankName}&accountNumber=${accountNumber}`"
				style="width: 220rpx;height: 80rpx;background-color: #FFDF20;font-size: 28rpx;display: flex;align-items: center;justify-content: center;border-radius: 20rpx;">
				变更银行卡</navigator>
		</view>
	</view>
	<view class="box" style="padding: 0 36rpx;">
		<view class="i">收款方式<text>{{type==1?'银行卡':(type==2?'微信':'支付宝')}}</text>
		</view>
		<!-- #ifdef MP-WEIXIN -->
		<view class="i" @click="moren=true">设置默认收款
			<image src="/static/icon/to_right.png" class="to_right" />
		</view>
		<!-- #endif -->
	</view>
	<view class="box" @click="jiebang=true" style="padding: 0 36rpx;">
		<view class="i">解除绑定
			<image src="/static/icon/to_right.png" class="to_right" />
		</view>
	</view>

	<view class="mask" v-if="moren">
		<view class="dialog">
			<image src="/static/icon/close.png" class="close" @click="moren=false" />
			<view class="content">变更后，默认提现收款方式将改为此账户，你依然可以在提现时选择其他账户收款。</view>
			<view class="btn_box">
				<view @click="moren=false">暂不修改</view>
				<view @click="submitMoren">确认修改</view>
			</view>
		</view>
	</view>
	<view class="mask" v-if="jiebang">
		<view class="dialog">
			<image src="/static/icon/close.png" class="close" @click="jiebang=false" />
			<view class="content">解绑后，该方式将无法收款。请确认是否解绑？</view>
			<view class="btn_box">
				<view @click="jiebang=false">暂不解绑</view>
				<view @click="submitJiebang">确认解绑</view>
			</view>
		</view>
	</view>
</template>

<script>
	import api from '@/utils/api.js';
	import util from '@/utils/util.js';
	export default {
		data() {
			return {
				moren: false,
				jiebang: false,
				type: null,
				realName: '',
				idNumber: '',
				bankName: '',
				accountNumber: '',
			}
		},
		async onLoad(options) {
			this.type = options.type;
		},
		async onShow() {
			if (this.type == 1) {
				let {
					result
				} = await api.account_and_auth();
				if (result?.memberAuthVo?.realName) {
					this.realName = util.desensitizeName(result.memberAuthVo.realName);
				}
				if (result?.memberAuthVo?.idNumber) {
					this.idNumber = util.desensitizeIdCard(result.memberAuthVo.idNumber);
				}
				this.bankName = result.bank.bankName;
				this.accountNumber = result.bank.accountNumber;
			}
		},
		methods: {
			async submitJiebang() {
				await api.del_member_account({
					type: this.type
				});
				this.jiebang = false;
				uni.showToast({
					title: '解绑成功',
					icon: 'success',
					duration: 1500
				})
				setTimeout(() => {
					uni.navigateBack({
						delta: 1
					})
				}, 1500)
			},
			async submitMoren() {
				await api.update_account(this.type);
				this.moren = false;
				uni.showToast({
					title: '设置默认成功',
					icon: 'success',
					duration: 1500
				})
			},
		}
	}
</script>

<style>
	.i {
		width: 100%;
		height: 120rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		gap: 10rpx;
		color: #62748E;
		font-size: 30rpx;
	}

	.box .i {
		border-bottom: 1px solid #E2E8F0;
		color: #62748E;
		font-size: 30rpx;
	}

	.box text {
		color: #020618;
	}

	.box .i:last-child {
		border: none;
	}

	.to_right {
		height: 32rpx;
		width: 32rpx;
	}
</style>